<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的主页</title>
    <link rel="stylesheet" href="CSS/common.css">
    <link rel="stylesheet" href="CSS/blog-dearl.css">
    <link rel="stylesheet" href="editor.md/css/editormd.min.css" />
</head>
<body>
    <!-- 这是我的主页 -->
    <!-- 导航栏 -->
    <div class="nav">
        <img src="imger/2.jpg" alt="这是一个logo图标">
        <span class="title">我的博客系统</span>
        <!-- 用来空出中间的位置 -->
        <span class="spacer"></span>
        <a href="blong.html">主页</a>
        <a href="blong_2.html">写博客</a>
        <a href="logout">注销</a>
    </div>



    <div class="container">
        <!-- 左侧个人信息 -->
        <div class="left">
             <!-- 用户详情 -->
            <div class="card">
                <img src="imger/2.jpg" class="avtar" alt="用户头像">
                <h3>Sunlightʊə</h3>
                <a href="https://gitee.com/fiber-cloud/projects?sort=&scope=&state=private">gitee 地址</a>
                <div class="counter">
                    <span >文章</span>
                    <span>分类</span>
                </div>
                <div class="counter">
                    <span id="count">2</span>
                    <span>1</span>
                </div>
            </div>
        </div>

        <div class="right">
        <!-- 使用这个div来包裹整个博客的内容详情 -->
        
             <!-- 博客的标题 -->
            <h3 class="title"></h3>
             <!-- 博客的发布时间 -->
            <div class="date"></div>
            <!-- 博客的内容 -->
            <div id="content" style="background-color:rgba(255, 255, 255, 0);">

            </div>
        </div>
    </div>    
    <script src="js/jquery.min.js"></script>
    <script src="editor.md/lib/marked.min.js"></script>
    <script src="editor.md/lib/prettify.min.js"></script>
    <script src="editor.md/editormd.js"></script>
    <script>
        $.ajax({
            type:'get',
            url:'blog'+location.search,
            success:function(body){
                //处理响应结果
                 //1.更新标题
                 let titleDiv=document.querySelector('.right .title');
                 titleDiv.innerHTML=body.title;
                 //2.更新日期
                 let dateDiv=document.querySelector('.date');
                 dateDiv.innerHTML=body.postTime;
                 //3.更新博客正文
                 editormd.markdownToHTML('content', { markdown: body.content });

            }
        })

        function chekLogin(){
            $.ajax({
                type:'get',
                url:'login',
                
                success:function(body){
                    if(body.userId && body.userId>0){
                        console.log("当前用户已登录");
                    }else{
                        location.assign('login.html');
                    }
                }

            });
        }
        chekLogin(); 

        function getAuthor(){
            $.ajax({
                type:'get',
                url:'author'+ location.search,
                success:function(body){
                    let  h3=document.querySelector('.left .card h3');
                    h3.innerHTML=body.username;
                }
            });
        }

        getAuthor();


        
        function countBlog(){
            $.ajax({
                url:'user',
                type:'get',
                contentType:'application/json; charset = utf8',
                success:function(body){
                    let count=document.querySelector('#count');
                    count.innerHTML=body;
                    console.log('body');
                }
            });
        }
        countBlog();
    </script>
</body>
</html>